<html	xmlns="http://www.w3.org/1999/xhtml"
		xmlns:jsp="http://java.sun.com/JSP/Page"
		xmlns:f="http://java.sun.com/jsf/core"      
		xmlns:h="http://java.sun.com/jsf/html"
		xmlns:c="http://java.sun.com/jsp/jstl/core"
		xmlns:p="http://primefaces.org/ui"
		xmlns:af="http://xmlns.oracle.com/adf/faces/rich"
		xmlns:rich="http://richfaces.org/rich" 
		xmlns:ui="http://java.sun.com/jsf/facelets"
		xmlns:a4j="http://richfaces.org/a4j">
     
    <h:head>
        <title>Affectation des copies</title>
		<link rel="stylesheet" href="../styles/style.css" />
    </h:head>
	
	<h:body>
	    <h:panelGroup rendered="#{loginBean.loginSucces}">
	    <ui:include src="../includes/header.xhtml" />
    	<ui:include src="../includes/menu.xhtml" />
    	    	
    	<div id="content">
	    	<h2>Attribution des copies</h2>
	    	<h:form id="form">
	    		<div class="choixCinema">
	                <p:fieldset style="font-size: 18x;" legend="Choix du cinéma">				
			    		<div class="carouselCinema">
				    		<p:carousel id="basicCarousel" value="#{affectationCopiesBean.cinemas}" var="cinema" rows="3" headerText="Liste des cinémas">  
								<div class="itemCarouselCine">
						            <div class="cineName"> <h:outputText value="#{cinema.nom}" /> </div>
						            <div class="cineAdresse"> <h:outputText value="#{cinema.adresse}" /> </div>
						            <div class="cineVille"> <h:outputText value="#{cinema.codePostal} #{cinema.ville}" /> </div>
							        <div class="cineBtnChoix">
										<p:commandLink id="view" update=":form:cineChoisiNom, :form:cineChoisiAdresse, :form:cineChoisiCP :form:fieldsetCopies :form:messageErreurCopie :form:errorMsgCinema" title="Choisir cinéma">  
								            <h:outputText styleClass="ui-icon ui-icon-circle-check" style="margin:0 auto;" />   
								            <f:setPropertyActionListener value="#{cinema}"   
								                    target="#{affectationCopiesBean.cinemaChoisi}" />  
								        </p:commandLink>
						        	</div>
						        </div>
						    </p:carousel>  
						</div>
						<div class="CinemaChoisi">
							<div class="cineChoisiTitle"> <h:outputText value="Cinéma choisi" /> </div>
							<div class="ItemCinemaChoisi">
								<div class="cineName"> <h:outputText id="cineChoisiNom" value="#{affectationCopiesBean.cinemaChoisi.nom}" /> </div>
					            <div class="cineAdresse"> <h:outputText id="cineChoisiAdresse" value="#{affectationCopiesBean.cinemaChoisi.adresse}" /> </div>
					            <div class="cineVille"> <h:outputText id="cineChoisiCP" value="#{affectationCopiesBean.cinemaChoisi.codePostal} #{affectationCopiesBean.cinemaChoisi.ville}" /> </div>
							</div>
						</div>				
					</p:fieldset>
				</div>
				
				<div class="selectionCopiesStock">
				<p:fieldset style="font-size: 18px;" id="fieldsetCopies" legend="Sélection des copies">
			            <div class="errorMsgCopies"> <h:outputText id="messageErreurCopie" value="#{affectationCopiesBean.errorMsg}" /> </div>	
	
			            <div class="filmsDispos">
				            <div class="titleFilmsDispos"> <h:outputText id="nbFilmsSources" value="Films disponibles : #{affectationCopiesBean.nbCopiesSources}" /> </div>
				            <h:dataTable id="dataTableFilmsDispos" style="font-size: 14px;border:none;margin-left:15px" 
				            	value="#{affectationCopiesBean.copiesSources}" var="copie" >
				            	<h:column>
				            		<h:outputText value="#{copie.film.titre}" /> 
				            	</h:column>
				            	<h:column>
				            		&#160;&#160;&#160; <h:outputText value="[#{affectationCopiesBean.getNbCopiesFilm(copie.film)} copie(s)]" /> &#160;&#160;&#160;
				            	</h:column>
				            	<h:column>
	            					<h:commandButton value="+"> 
		            					<f:ajax listener="#{affectationCopiesBean.ajouterCopie(copie)}" render=":form:messageErreurCopie :form:fieldsetCopies"/>
	            					</h:commandButton>
				            	</h:column>
				            </h:dataTable>
						</div>
						
						<div class="filmAjoutes">
				            <div class="titleFilmsajoutes"> <h:outputText id="nbFilmsAjoutes" value="Films ajoutés : #{affectationCopiesBean.nbCopiesSelectionnees}" /> </div>
      				  		<h:dataTable id="dataTableFilmsAjoutes" style="font-size: 14px;border:none;margin-left:15px" 
				            	value="#{affectationCopiesBean.copiesSelectionnes}" var="copie" >
				            	<h:column>
		            				<td> <h:outputText value="#{copie.film.titre} " /> &#160;&#160;&#160;</td>
				            	</h:column>
				            	<h:column>
	            					<h:commandButton value="-"> 
		            					<f:ajax listener="#{affectationCopiesBean.retireCopieAjoutee(copie)}" render=":form:fieldsetCopies :form:messageErreurCopie"/>
	            					</h:commandButton>
				            	</h:column>
				            </h:dataTable>
						</div>
					</p:fieldset>
		            <div class="errorMsgCopiesCinema"> <h:outputText id="errorMsgCinema" value="#{affectationCopiesBean.errorMsgCinema}" /> </div>	
					<div class="btnValiderCopiesCine"> <h:commandButton value="Valider" action="#{affectationCopiesBean.validerCopies()}"/> </div>
				</div>
			</h:form>				
		</div>
		<ui:include src="../includes/footer.xhtml" />
    	</h:panelGroup>
    	
    	<h:panelGroup rendered="#{!loginBean.loginSucces}">
			<ui:include src="../includes/authError.xhtml" />	
    	</h:panelGroup>
	</h:body>
</html>